<div class="row span8" id="remitoForm" data-bind="with: remito">
	<div class="print">		
	<div>
		<div data-bind="visible: !$root.cargarForm()">
			<div class="alert alert-info">
				<label>Cargando <i class="icon-refresh"></i></label>
			</div>
		</div>
		<div class="span8 well" data-bind="visible: $root.mostrarForm() && $root.cargarForm()" style="display:none ">
			<h4><span data-bind="text: $root.tipoRemito"></span> Numero: <span data-bind="text: idActual"></span></h4>
			<hr>
			<table width="100%" id="datosRemito">
				<tr>
					<td><label class="span2 label" for="selectEmpresa">Fecha:</label></td>
					<td><input class="input-small uneditable-input" readonly="" id="inputFecha" data-bind="value: fecha" /></td>
					<!-- ko if: (tipo()=='1') -->
						<td><label class="span2 label">Hora Retiro:</label></td>
						<td><input class="input-small" data-bind="value: horaRetiro" /></td>
					<!-- /ko -->
					<!-- ko if: (tipo()=='3') -->
						<td><label class="span2 label">Hora Entrega:</label></td>
						<td><input class="input-small" data-bind="value: horaEntrega" /></td>
					<!-- /ko -->
				</tr>
				<tr>
					<td><label class="span2 label" for="selectEmpresa">Cliente:</label></td>
					<td>
						<!-- ko ifnot: $root.editando() -->
							<select id="selectEmpresa" data-bind="options: $root.empresas, optionsText: 'razonSocial', value: empresa" class="span4"></select>
						<!-- /ko -->
						<!-- ko if: $root.editando() -->
							<input class="span2 uneditable-input" readonly="" id="inputEmpresa" data-bind="value: empresa() ? empresa().razonSocial: ''" />
						<!-- /ko -->
					</td>
					<td colspan="2">
						<!-- ko ifnot: $root.editando() -->
							<select id="selectDeposito" data-bind="options: empresa().depositos, optionsText: 'nombre', value: deposito" class="span4"></select>
						<!-- /ko -->
						<!-- ko if: $root.editando() -->
							<input class="span2 uneditable-input" readonly="" id="inputDeposito" data-bind="value: deposito() ? deposito().nombre : ''" />
						<!-- /ko -->
					</td>
				</tr>
				<tr>
					<td><label class="span2 label" for="inputApellido">Domicilio:</label></td>
					<td colspan="3"><input class="span6 uneditable-input" readonly="" id="inputApellido" data-bind="value: deposito() ? deposito().domicilio : ''"></input></td>
				</tr>
				<tr>
					<td><label class="span2 label" for="inputCalle">Departamento:</label></td>
					<td><input class="span3 uneditable-input" readonly="" id="inputCalle" data-bind="value: deposito() ? deposito().departamento : ''"></input></td>
					<td><label class="span2 label" for="inputCUIT">N&uacute;mero de CUIT :</label></td>
					<td><input class="input-medium uneditable-input" readonly="" id="inputCUIT" data-bind="value: empresa() ? empresa().cuit : ''"></input></td>
				</tr>
				<tr>
					<td><label class="span2 label" for="inputIVA">Condici&oacute;n de IVA:</label></td>
					<td><input class="span3 uneditable-input" readonly="" id="inputIVA" data-bind="value: empresa() ? empresa().iva : ''"></input></td>
					<td><label class="span2 label" for="selectChofer">Chofer:</label></td>
					<td>
							<select id="selectChofer" data-bind="options: $root.choferes, optionsValue: 'id', optionsText: 'nombre', value: chofer" class="span2"></select>
					</td>
				</tr>
				<tr>
					<td><label class=" span2 label" for="selectvehiculo">Vehiculo:</label></td>
					<td>
							<select id="selectVehiculo" data-bind="options: $root.vehiculos, optionsValue: 'id', optionsText: 'patente', value: vehiculo"></select>
					</td>
				</tr>
				<tr>
					<td><label class="span2 label" for="inputDetalle">Observaciones:</label></td>
					<td colspan="3"><textarea id="inputDetalle" data-bind="value:observaciones" class="span6" /></textarea></td>
				</tr>
			</table>
		</div>
		<div class="span8" data-bind="visible: !$root.mostrarForm() && $root.cargarForm()" style="display:none ">
			<div data-bind="visible: $root.mostrarSuccess" class="alert alert-success">
				<span data-bind="text: $root.successMensaje"></span>
			</div>
			<div data-bind="visible: $root.mostrarError" class="alert alert-error">
				<span data-bind="text: $root.errorMensaje"></span>
			</div>
		</div>
		<div class="span8 well" data-bind="visible: $root.mostrarForm() && $root.cargarForm()" style="display:none ">
			<table class="span7">
				<thead>
					<tr>
						<th>Codigo</th>
						<th>Descripcion</th>
						<th data-bind="visible: $root.tipoActual()=='1' || $root.tipoActual()=='2'">Entrega</th>
						<th data-bind="visible: $root.tipoActual()=='3' || $root.tipoActual()=='2'">Retira</th>
					</tr>
				</thead>
				<tbody class="table table-condensed">
					<tr>
						<td colspan="2"><select rel="noprint" type="text" id="inputCodigo" data-bind="visible: $parent.productos().length > 0, options: $parent.productos, optionsText: 'codigoTexto', value: $parent.codigoSeleccionado, css: {span6: $root.tipoActual()=='1' || $root.tipoActual()=='1', span3: $root.tipoActual()=='2'}"></select></td>
						<td style="text-align:center " data-bind="visible: $root.tipoActual()=='1' || $root.tipoActual()=='2'"><input rel="noprint" type="text" id="inputEntrega" class="input-small" data-bind="visible: $parent.productos().length > 0" placeholder="0"></td>
						<td style="text-align:center " data-bind="visible: $root.tipoActual()=='3' || $root.tipoActual()=='2'"><input rel="noprint" type="text" id="inputRetira" class="input-small" data-bind="visible: $parent.productos().length > 0" placeholder="0"></td>
						<td><input type="button" rel="noprint" id="registro" class="btn" data-bind="visible: $parent.productos().length > 0, click: $parent.agregar" value="Agregar" /></td>
						<td><span class="alert alert-error" data-bind="visible: $root.hayError, text: $root.cargaError" style="font-size:9px "></span></td>
					</tr>
				</tbody>
				<tbody data-bind="visible: lineaRemitos().length == 0">
					<tr class="alert alert-info"><td colspan="6">El Remito no tiene productos.</td></tr>
				</tbody>				
				<tbody class="table table-striped table-bordered" data-bind="foreach: lineaRemitos, visible: lineaRemitos().length > 0">
					<tr>
						<td>
							<span data-bind="text: codigo, attr: {id: 'showCodigo' + $data.codigo()}"></span>
						</td>
						<td data-bind="text: descripcion"></td>
						<td style="text-align:center " data-bind="visible: $root.tipoActual()=='1' || $root.tipoActual()=='2'">
							<input data-bind="value: entrega, attr: {id: 'editEntrega' + $data.codigo()}" style="display:none;" class="input-medium" placeholder="0">
							<span data-bind="text: entrega, attr: {id: 'showEntrega' + $data.codigo()}"></span>
						</td>
						<td style="text-align:center " data-bind="visible: $root.tipoActual()=='3' || $root.tipoActual()=='2'">
							<input data-bind="value: retira, attr: {id: 'editRetira' + $data.codigo()}" style="display:none;" class="input-medium" placeholder="0">
							<span data-bind="text: retira, attr: {id: 'showRetira' + $data.codigo()}"></span>
						</td>
						<td>
							<a href="#" data-bind="click: $root.editar, attr: {id: 'editProd' + $data.codigo()}"><i class="icon-edit"></i></a> 
							<a href="#" data-bind="click: $root.borrar, attr: {id: 'delProd' + $data.codigo()}"><i class="icon-remove"></i></a> 
							<a href="#" data-bind="click: $root.aceptar, attr: {id: 'saveProd' + $data.codigo()}" style="display:none;"><i class="icon-ok"></i></a>
						</td>
						<td data-bind="visible: faltante() > 0" colspan="2">
							<span class="label">Faltante: <span data-bind="text: faltante"></span></span>
						</td>
					</tr>
				</tbody>
			</table>
		</div>
		</div>
		</div>
		<div class="span8 well" data-bind="visible: $root.mostrarForm() && $root.cargarForm()" style="display:none ">
			<div data-bind="visible: $root.tipoActual()!='3'">
				<div class="input-append span3" style="margin-left: 0px !important;">
					<button id="generar" class="btn btn-warning" data-bind="click: $parent.generar">Generar</button>
					<select id="generar" class="span2" data-bind="visible: $root.editando(), value: $root.tipo">
						<!-- ko if: $root.tipoActual()=='1' -->
							<option value="2">Orden De Trabajo</option>
						<!-- /ko -->
						<!-- ko if: $root.tipoActual()=='2' -->
							<option value="3">Remito De Salida</option>
						<!-- /ko -->
					</select>
				</div>
				<label class="span1 label" style="margin-left:-20px; margin-top:5px; margin-right: 50px"> N&uacute;mero <span data-bind="text: id"></span></label>
			</div>
			<div style="text-align:right " data-bind="css: {span3: $root.tipoActual()!='3', span7: $root.tipoActual()=='3'}">
				<!-- ko if: $root.editando() -->
					<button id="guardar" class="btn btn-primary" data-bind="click: $parent.guardar">Guardar</button>
				<!-- /ko -->
				<button id="cancelar" class="btn" data-bind="click: $parent.cancelar">Cancelar</button>
			</div>
		</div>
	</div>
</div>
<script language="javascript">
	function lineaRemito() {
		var self = this;
		
		self.codigo = ko.observable();
		self.entrega = ko.observable(0);
		self.retira = ko.observable(0);
		self.faltante = ko.observable();
		self.descripcion = ko.observable();
		self.deposito = ko.observable();
	}
	
	function Remito() {
		var self = this;
		
		self.id = ko.observable(null);
		self.idActual = ko.observable(null);
		self.tipo = ko.observable("1");
		self.deposito = ko.observable(null);
		self.empresa = ko.observable(null);
		self.persona = ko.observable(null);
		self.chofer = ko.observable(null);
		var nuevafecha = new Date();
		self.fecha = ko.observable(nuevafecha.getDate() + "/" + (nuevafecha.getMonth()+1) + "/" + nuevafecha.getFullYear());
		self.lineaRemitos = ko.observableArray();
		self.observaciones = ko.observable(null);
		self.horaEntrega = ko.observable(nuevafecha.getHours() + ":" + nuevafecha.getMinutes());
		self.horaRetiro = ko.observable(nuevafecha.getHours() + ":" + nuevafecha.getMinutes());
		self.vehiculo = ko.observable(null);
		self.editando = ko.observable(amplify.store.sessionStorage("sterilav.remitoEditado"));
	}
	
	function RemitoModelo() {
		var self = this;
		
		self.title = ko.observable("Administrar Usuario");
		self.mostrarForm = ko.observable(true);
		self.cargarForm = ko.observable(false);
		self.mostrarSuccess = ko.observable(false);
		self.successMensaje = ko.observable("");
		self.mostrarError = ko.observable(false);
		self.errorMensaje = ko.observable("");
		self.mostrarFormError = ko.observable(false);
		self.formErrorMensaje = ko.observable("");
		self.hayError = ko.observable(false);
		self.cargaError = ko.observable("");
				
		self.nuevaLinea = ko.observable(new lineaRemito());
		self.codigos = ko.observableArray();
		self.codigoSeleccionado = ko.observable(null);
		self.empresas = ko.observableArray();
		self.choferes = ko.observableArray();
		self.vehiculos = ko.observableArray();
		self.productos = ko.observable();
		self.tipo = ko.observable();
		self.tipoActual = ko.observable("1");
		self.tipoRemito = ko.computed(function() {
			if(self.tipoActual()=="1") {
				return "Remito";
			} else if (self.tipoActual()=="2") {
				return "Orden de Trabajo";
			} else if (self.tipoActual()=="3") {
				return "Remito";
			}
		});
		
		self.remito = ko.validatedObservable(new Remito());
		self.editando = ko.observable(amplify.store.sessionStorage("sterilav.remitoEditado"));
		
		self.agregar = function() {
			var linea = new lineaRemito();
			linea.codigo(self.codigoSeleccionado().codigo);			
			var hayError = false;
			if(!$("#inputEntrega").val()) {
				if(self.tipoActual()!="3") {
					hayError = true;
				} else {
					$("#inputEntrega").val(0);
				}
			}
			if(!$("#inputRetira").val()) {
				if(self.tipoActual()!="1") {
					hayError = true;
				} else {
					$("#inputRetira").val(0);
				}
			}
			self.hayError(hayError);
			if(hayError) {
				self.cargaError("Verifique los valores.");
				return;
			}
			linea.entrega($("#inputEntrega").val());
			linea.retira($("#inputRetira").val());
			$("#inputEntrega").val(0);
			$("#inputRetira").val(0);
			linea.descripcion(self.codigoSeleccionado().descripcion);			
			linea.deposito(self.codigoSeleccionado().deposito);
			linea.faltante(self.codigoSeleccionado().faltante);
			self.remito().lineaRemitos.push(linea);
			self.codigos.remove(self.codigoSeleccionado());	
		};
		
		self.editar = function(prod) {
			$("#saveProd" + prod.codigo()).show();
			$("#editEntrega" + prod.codigo()).show();
			$("#showEntrega" + prod.codigo()).hide();
			$("#editRetira" + prod.codigo()).show();
			$("#showRetira" + prod.codigo()).hide();
			$("#delProd" + prod.codigo()).hide();
			$("#editProd" + prod.codigo()).hide();
		};
		
		self.borrar = function(prod) {
			self.remito().lineaRemitos.remove(prod);
			var produ = {};
			produ.codigo = prod.codigo();
			produ.capita = 0;
			produ.codigoTexto = prod.codigo() + " - " + prod.descripcion();
			produ.descripcion = prod.descripcion();
			produ.deposito = prod.deposito();
			produ.faltante = prod.faltante();
			produ.stock = 0;
			self.codigos().push(produ);
			self.codigos.sort(function(left, right) { 
				return left.codigoTexto == right.codigoTexto ? 0 : (left.codigoTexto < right.codigoTexto ? -1 : 1) 
			});			
			self.codigos.valueHasMutated();
		};
						
		self.aceptar = function(prod) {
			var indexof = self.remito().lineaRemitos.indexOf(prod);
			$("#saveProd" + prod.codigo()).hide();
			$("#editEntrega" + prod.codigo()).hide();
			$("#showEntrega" + prod.codigo()).show();
			$("#editRetira" + prod.codigo()).hide();
			$("#showRetira" + prod.codigo()).show();
			$("#delProd" + prod.codigo()).show();
			$("#editProd" + prod.codigo()).show();

			$("#showEntrega" + prod.codigo()).text(prod.entrega());
			$("#showRetira" + prod.codigo()).text(prod.retira());
		};
				
		self.volver = function() {
			window.location.href = "./Index.html";
		};
		
		self.cargaEmpresas = function() {
			var exitoEmpresa = function(empresas) {
				if(empresas.status != "OK") {
				} else {
					for(var i=0; i< empresas.data.length; i++) {
						var emp = new CEmpresa();
						emp.cargar(empresas.data[i]);
						emp.depositos = new Array();
						for(var j=0; j< empresas.data[i].depositos.length; j++) {
							var dep = new CDeposito();
							dep.cargar(empresas.data[i].depositos[j]);
							emp.depositos.push(dep);
						}
						self.empresas().push(emp);
					}
				}
				if(!amplify.store.sessionStorage("sterilav.remitoEditado")) {
					self.remito().empresa(self.empresas()[0]);
					self.remito().deposito(self.empresas()[0].depositos[0]);
				}
			};
			var fallaEmpresa = function(data) {
			};
			getDataSync("./servidor/sterilav.php?op=listaEmpresas",exitoEmpresa,fallaEmpresa);
		};
		self.cargaChoferes = function() {
			var exitoChofer = function(choferes) {
				if(choferes.status != "OK") {
				} else {
					for(var i=0; i< choferes.data.length; i++) {
						self.choferes().push(choferes.data[i]);
					}
				}
			};
			var fallaChofer = function(data) {
			};
			getDataSync("./servidor/sterilav.php?op=listaChoferes",exitoChofer,fallaChofer);
		};
		self.cargaVehiculos = function() {
			var exitoVehiculo = function(vehiculos) {
				if(vehiculos.status != "OK") {
				} else {
					for(var i=0; i< vehiculos.data.length; i++) {
						var newVehiculo = new CVehiculo();
						newVehiculo.id(vehiculos.data[i].id);
						newVehiculo.patente(vehiculos.data[i].patente);
						self.vehiculos().push(newVehiculo);
					}
				}
			};
			var fallaVehiculo = function(data) {
			};
			getDataSync("./servidor/sterilav.php?op=listaVehiculos",exitoVehiculo,fallaVehiculo);
		};
		self.cargaProductos = function() {
			var exitoDelProducto = function(productos) {
				if(productos.status != "OK") {
				} else {
					for(var i=0; i< productos.data.length; i++) {
						self.codigos().push(productos.data[i]);
					}
				}
			};
			var fallaProducto = function(data) {
			};
			getDataSync("./servidor/sterilav.php?op=listaProductosParaRemito",exitoDelProducto,fallaProducto);
		};
		self.cargaPersonas = function() {
			var exitoPersona = function(personas) {
				if(personas.status != "OK") {
				} else {
					self.remito().persona(new CUsuario());
					self.remito().persona().id(personas.data.id);
					self.remito().persona().usuario(personas.data.usuario);
					self.remito().persona().nombre(personas.data.nombre);
					self.remito().persona().apellido(personas.data.apellido);
					self.remito().persona().perfil(personas.data.perfil);
					self.remito().persona().password(personas.data.password);
					self.remito().persona().departamento(personas.data.departamento);
					self.remito().persona().remito(personas.data.remito);
					self.remito().persona().activo(personas.data.activo);
				}
			};
			var fallaPersona = function(data) {
			};
			getDataSync("./servidor/sterilav.php?op=getUsuarioPorNombre&nombre="+amplify.store.sessionStorage("sterilav.usuarioLogueado"),exitoPersona,fallaPersona);
		};
		
		self.guardar = function() {
			self.remito().errors.showAllMessages(true);
			var exito = function(data) {
				if(data.status != "OK") {
					self.errorMensaje(data.data);
					self.mostrarError(true);
				} else {
					self.mostrarError(false);
					self.mostrarForm(false);
					self.successMensaje(data.data);
					self.mostrarSuccess(true);
					amplify.store.sessionStorage("sterilav.remitoEditado", null);
				}
			};
			var falla = function(data) {
				if(data.data) {
					self.errorMensaje(data.data);
				} else {
					self.errorMensaje("Hubo un error tratando de guardar el Remito.");
				}
				self.mostrarError(true);				
			};
			var url = "";
			self.remito().tipo(self.tipo());
			if(amplify.store.sessionStorage("sterilav.remitoEditado")) {
				self.remito().id(amplify.store.sessionStorage("sterilav.remitoEditado"));
				url = "./servidor/sterilav.php?op=saveRemito";
			}
			
			postData(url,exito,falla,JSON.parse(ko.toJSON(self.remito())));
		};
		
		self.generar = function() {
			self.remito().errors.showAllMessages(true);
			var exito = function(data) {
				if(data.status != "OK") {
					self.errorMensaje(data.data);
					self.mostrarError(true);
				} else {
					self.mostrarError(false);
					self.mostrarForm(false);
					self.successMensaje(data.data);
					self.mostrarSuccess(true);
					amplify.store.sessionStorage("sterilav.remitoEditado", null);
				}
			};
			var falla = function(data) {
				if(data.data) {
					self.errorMensaje(data.data);
				} else {
					self.errorMensaje("Hubo un error tratando de generar el Remito.");
				}
				self.mostrarError(true);				
			};
			var url = "";
			self.remito().tipo(self.tipo());
			if(amplify.store.sessionStorage("sterilav.remitoEditado")) {
				self.remito().id(amplify.store.sessionStorage("sterilav.remitoEditado"));
				url = "./servidor/sterilav.php?op=updateRemito";
			} else {
				url = "./servidor/sterilav.php?op=putRemito";
			}
			
			postData(url,exito,falla,JSON.parse(ko.toJSON(self.remito())));
		};
		self.cancelar = function() {
			amplify.store.sessionStorage("sterilav.remitoEditado", null);
			window.location.href = "./Index.html";
		};
		self.cargar = function() {
			var exito = function(data) {
				if(data.status != "OK") {
				} else {
					self.remito().idActual(data.data.id);
					self.remito().deposito = ko.observable(new CDeposito());
					self.remito().empresa = ko.observable(new CEmpresa());
					self.remito().deposito().cargar(data.data.deposito);
					self.tipoActual(data.data.tipo);
					self.remito().empresa().cargar(data.data.empresa);
					self.remito().chofer(data.data.chofer.id);
					self.remito().vehiculo(data.data.vehiculo.id);
					var nuevafecha = new Date();
					self.remito().fecha((nuevafecha.getDate() + "/" + (nuevafecha.getMonth()+1) + "/" + nuevafecha.getFullYear()));
					for(i=0; i<data.data.productos.length;i++) {
						var linea = new lineaRemito();
						linea.codigo(data.data.productos[i].codigo);
						linea.descripcion(data.data.productos[i].descripcion);
						linea.deposito(data.data.productos[i].deposito);			
						linea.faltante(data.data.productos[i].faltante);			
						linea.retira(data.data.productos[i].retira);			
						linea.entrega(data.data.productos[i].entrega);
						self.remito().lineaRemitos.push(linea);
					}
					self.remito().observaciones(data.data.observaciones);
					//ko.applyBindings(self.remito(), document.getElementById("datosRemito"));  
				}
			};
			var falla = function(data) {
			};
			getDataSync("./servidor/sterilav.php?op=getRemito&id=" + amplify.store.sessionStorage("sterilav.remitoEditado"),exito,falla);
		};
		
		if(amplify.store.sessionStorage("sterilav.remitoEditado")) {
			self.cargar();
		}
		self.cargaProductos();
		self.cargaPersonas();
		self.cargaEmpresas();
		self.cargaChoferes();
		self.cargaVehiculos();
		self.cargarForm(true);
		var exitoprox = function(data) {
			if(data.status != "OK") {
			} else {
				self.remito().id(data.data.id);
			}
		};
		var fallaprox = function(data) {
			self.remito().id(-1);
		};
		getDataSync("./servidor/sterilav.php?op=getProximoRemito",exitoprox,fallaprox);

		self.productos = ko.computed(function() {
			if(!self.remito().deposito()) {
				return self.codigos();
			} else {
				return ko.utils.arrayFilter(self.codigos(), function(item) {
					return item.deposito == self.remito().deposito().id();
				});		
			}
		}, this);		
		self.codigos.sort(function(left, right) { 
			return left.codigoTexto == right.codigoTexto ? 0 : (left.codigoTexto < right.codigoTexto ? -1 : 1) 
		});			
	}

	ko.cleanNode(document.getElementById("remitoForm"));
	var remitoModelo = new RemitoModelo();

	ko.applyBindings(remitoModelo, document.getElementById("remitoForm"));  
</script>
